
import 'package:flutter/material.dart';


class BottomNavigator_ extends StatefulWidget{
  @override
  State<StatefulWidget> createState() {
    return BottomNaviState();
  }
}

class BottomNaviState extends State<BottomNavigator_>{

  var _selectPageIndex = 0;

  final List<Widget> pageList = [
    PageTestCenter("page1"),
    PageTestCenter("page2")
  ];


  Widget _getPage(var index){
    return Offstage(
      offstage: index != _selectPageIndex,
      child: TickerMode(
        enabled: index == _selectPageIndex,
        child: pageList[index],
      ),
    );
  }

  _selectIndex(var index){
    setState(() {
      _selectPageIndex = index;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Stack(
        children: [
          _getPage(0),
          _getPage(1)
        ],
      ),
      bottomNavigationBar: BottomNavigationBar(
        items: [
          BottomNavigationBarItem(
            icon:Icon(
              Icons.shop,
              color: Color.fromARGB(255, 125, 125, 125),
            ),
            activeIcon: Icon(
                Icons.shop
            ),
            label: "购物"
          ),
          BottomNavigationBarItem(
              icon: Icon(
                  Icons.sports,
                  color: Color.fromARGB(255, 125, 125, 125),
              ),
              activeIcon: Icon(
                  Icons.sports
              ),
              label: "运动"
          )
        ],
        onTap: (var index){
          _selectIndex(index);
        },
        currentIndex: _selectPageIndex,
        unselectedFontSize: 16,
        selectedFontSize: 18,
      ),
    );
  }

}


class PageTestCenter extends StatelessWidget{
  PageTestCenter(var tip){
    this.tip = tip;
  }
  var tip = "";
  @override
  Widget build(BuildContext context) {
    return Center(
      child: Text(
        tip,
      style: const TextStyle(color: Colors.green),
      textAlign: TextAlign.center,),
    );
  }

}